先寫時間輪播的部分
一樣先做一個data預設

data: {
    time: [0, 3, 4, 2, 4, 4, 5]
}

預設的數字是每一個"介紹"中有多少張圖片

然後寫函式

timechange() {
    for (let i = 0; i < this.indexs.length; i++) {
        this.indexs[i]++;
        if (this.indexs[i] >= this.time[i]) {
            this.indexs[i] = 0
            this.indexs.push();
        }
        else {
            this.indexs.push();
        }
    }
}

函式內容會比Day12的複雜
首先要讓indexs中的每一個數字都要做到加法，才能讓圖片自己往後切一張
所以要使用for迴圈讓indexs這個陣列的每一個數字都改動到
然後需要判斷是否已經是該"介紹"的最後一張圖
寫一個判別式，若indexs陣列的該項數值>=time陣列同一項，代表已經到最後一張，必須切回第一張，所以直接把數值設定成0
寫好函式後在mounted呼叫他

mounted() {
    setInterval(this.timechange, 3000);
}

便能讓圖片自己切換了

為了讓切換看的明顯，動圖的秒數是1秒，比較舒適的秒數是2~3秒左右

然後來寫tab標籤被點擊時此篇跟前篇做的一些預設的更動
這邊全部都是寫在Day13的tab標籤會使用到的indexPlus函式
幫函式再新增兩個參數，用以判別被點擊到的tab有多少"介紹"跟各自有多少"圖片"
然後需要改動的是indexs跟time的內容

indexPlus(n, s, im) {
    this.indexs = []
    this.time = []
    for (let i = 0; i < s; i++) {
        this.indexs.push(0)
    }
    for (let i = 0; i < s - 1; i++) {
        this.time.push(im[i + 1].im.length)
    }
    this.time.unshift(0)
    this.tab.fill(false);
    this.tab[n] = 1;
}

在函式中設定好陣列的清除與加入新東西後，我們需要在tab使用函式時給予相對應的參數數值，所以HTML也要做改動

<a class="tab_title" @click="indexPlus(index, itr.length, itr)" for="key" :class="{'choose':tab[index]}">{{key}}</a>

這樣子改過之後我們的tab就能隨意切換也不會跑掉了